<template>
	<view class="container">
		<view class="container__title">
			订单
		</view>
		<view class="container__items">
			<navigator 
				class="container__items-item" 
				url="/pages/index/index"
				hover-class="none"
			>
				<view class="container__items-item-icon"></view>
				<view class="container__items-item-text">待支付</view>
			</navigator>
			<navigator
				class="container__items-item" 
				url="/pages/index/index"
				hover-class="none"
			>
				<view class="container__items-item-icon"></view>
				<view class="container__items-item-text">待服务</view>
			</navigator>
			<navigator
				class="container__items-item" 
				url="/pages/index/index"
				hover-class="none"
			>
				<view class="container__items-item-icon"></view>
				<view class="container__items-item-text">服务中</view>
			</navigator>
			<navigator
				class="container__items-item" 
				url="/pages/index/index"
				hover-class="none"
			>
				<view class="container__items-item-icon"></view>
				<view class="container__items-item-text">服务完成</view>
			</navigator>
		</view>
	</view>
</template>


<style scoped lang="scss">
	.container{
		padding: 0 $cool-components-padding-lr;
		background-color: red;
		&__title{
			height: 60rpx;
			line-height: 60rpx;
			font-size: $cool-font-size-title;
			color: $cool-font-color-primary;
			background-color: yellow;
		}
		&__items{
			height: 150rpx;
			display: flex;
			justify-content: space-between;
		}
	}
</style>